import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:verse_systems/commom/models/order_model.dart';
import 'package:verse_systems/commom/models/product_model.dart';
import 'package:verse_systems/commom/routers/routes_pages_name.dart';
import 'package:verse_systems/pages/order/order_control.dart';
import 'package:verse_systems/res/colors.dart';
import 'package:verse_systems/utils/image_utils.dart';
import 'package:verse_systems/widgets/drawer_appbar.dart';
import 'package:verse_systems/widgets/order_empty.dart';
import 'package:verse_systems/widgets/sp_button.dart';

class OrderPage extends StatefulWidget {
  const OrderPage({super.key});

  @override
  State<OrderPage> createState() => _OrderPageState();
}

class _OrderPageState extends State<OrderPage> {
  final control = Get.find<OderControl>();
  final state = Get.find<OderControl>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Colours.system_background_color,
        body: GetBuilder<OderControl>(
            init: control,
            builder: (_) {
              return SizedBox(
                height: MediaQuery.of(context).size.height,
                child: Stack(
                  children: [_loanUs, _aboutContent],
                ),
              );
            }));
  }

  Widget get _aboutContent {
    return SizedBox(
        child: SingleChildScrollView(
      child: Column(
        children: [
        DrawerAppbar(
            backgroundColor: Colors.transparent,
            color: Colours.app_main_color,
            title: 'my_orders'.tr,
          ),
         _orders,
          _commend,
          Column(children: _productList)
        ],
      ),
    ));
  }

  Widget get _orders {
    return Container(
     padding: EdgeInsets.fromLTRB(27.w, 26.w, 27.w, 0.w),
      // height: 500.w,
      margin: EdgeInsets.symmetric(
          horizontal: (MediaQuery.of(context).size.width - 330.w) / 2,
          vertical: 15.w),
      width: 330.w,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(10.w)),
        color: Colours.app_main_color,
           boxShadow: [
                BoxShadow(
                    color:
                        Colours.stringAnAlphaColor("0xff000000", alpha:  0.08),
                    offset: const Offset(0.0, 15.0), //阴影xy轴偏移量
                    blurRadius: 25.0, //阴影模糊程度
                    spreadRadius: 0.5 //阴影扩散程度
                    )
              ]
        //Colours.stringAnAlphaColor("0xFFFFFFFF",alpha: 0.9),
      ),
      // child: _empty,
      child: state.order_list.isEmpty
          ? _empty
          : Column(
              children: _orderList,
            ),
    );
  }

  Widget get _empty {
    return  OrderEmpty(empty:  state.no_order_notice);
  }

  List<Widget> get _orderList {
    return state.order_list.map((OrderModel model) {
      return InkWell(
          onTap: () {
            Get.toNamed(RoutesPage.OrderDetails,
                arguments: {"borrow_id": model.borrowId});
          },
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                "${"apply_date".tr}:${model.applyTime.toString()}",
                style: TextStyle(
                  color: Colours.app_text_color,
                  fontSize: 14.sp,
                ),
              ),
              Container(
                margin: EdgeInsets.fromLTRB(0, 26.w, 0, 20.w),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Row(
                      children: [
                        Text(
                          "¥",
                          style: TextStyle(
                            color: Colours.app_bank_text_color,
                            fontSize: 14.sp,
                          ),
                        ),
                        Text(
                          model.amount.toString(),
                          style: TextStyle(
                            color: Colours.app_bank_text_color,
                            fontSize: 34.sp,
                          ),
                        ),
                      ],
                    ),
                    InkWell(
                      child: Row(
                        children: [
                          Text(
                            model.status.toString(),
                            style: TextStyle(
                              color: Colours.app_main_background_color,
                              fontSize: 14.sp,
                            ),
                          ),
                          Icon(
                            Icons.arrow_forward_ios_rounded,
                            color: Colours.app_line_color,
                            size: 18.w,
                          )
                        ],
                      ),
                    )
                  ],
                ),
              ),
              Text(
                "${"fine_pay".tr}:${model.overdueAmount.toString()}元",
                style: TextStyle(
                  color: Colours.app_text_color,
                  fontSize: 14.sp,
                ),
              ),
              Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
                Text(
                  "${"all_repay".tr}:${model.repayAmount.toString()}元",
                  style: TextStyle(
                    color: Colours.app_text_color,
                    fontSize: 14.sp,
                  ),
                ),
                SizedBox(
                  width: 75.w,
                  child: SPButton(
                    minHeight: 22.w,
                    fontSize: 13.sp,
                    text: "go_repayment".tr,
                    textColor: Colours.app_repayment_text_color,
                    radius: 11.w,
                    side: const BorderSide(
                      color: Colours.app_repayment_text_color,
                      width: 1.0,
                    ),
                    onPressed: () {
                      Get.toNamed(RoutesPage.OrderDetails,
                          arguments: {"borrow_id": model.borrowId});
                    },
                  ),
                ),
              ]),
              SizedBox(height: 26.w),
              Column(children: _repayOrderList(details: model.details)),
              Container(
                  margin: EdgeInsets.fromLTRB(0, 19.w, 0, 36.w),
                  width: 330.w,
                  child: Column(
                    children: [
                      Text(
                        "prompts".tr,
                        style: TextStyle(
                          color: Colours.app_main_background_color,
                          fontSize: 14.sp,
                        ),
                      ),
                      Text(
                        model.notice.toString(),
                        style: TextStyle(
                          color: Colours.app_main_background_color,
                          fontSize: 10.sp,
                        ),
                        textAlign: TextAlign.center,
                      ),
                    ],
                  ))
            ],
          ));
    }).toList();
  }

  List<Widget> _repayOrderList({required List<OrderModelDetails>? details}) {
    return details!.map((OrderModelDetails model) {
      return Column(
        children: [
        Container(
          height: 50.w,
          alignment: Alignment.center,
          child:   Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                model.key.toString(),
                style: TextStyle(
                  color: Colours.app_text_color,
                  fontSize: 14.sp,
                ),
              ),
              Text(
                model.value.toString(),
                style: TextStyle(
                  color: Colours.app_bank_text_color,
                  fontSize: 14.sp,
                ),
              ),
            ],
          ),
        ),
          Container(
            height: 1.w,
            color: Colours.app_text_line_color,
          ),
        ],
      );
    }).toList();
  }

  Widget get _commend {
    return Container(
        child: (state.product.isEmpty)
            ? null
            : Container(
                margin: EdgeInsets.symmetric(
                    vertical: 10.w,
                    horizontal:
                        (MediaQuery.of(context).size.width - 330.w) / 2),
                child: Row(
                  children: [
                    Container(
                      margin: EdgeInsets.only(right: 5.w),
                      width: 4.w,
                      height: 15.w,
                      color: Colours.app_home_tag_color,
                    ),
                    Text(
                      "recommendation".tr,
                      style: TextStyle(
                        color: Colours.app_black_text_color,
                        fontSize: 16.sp,
                        fontWeight: FontWeight.w400
                      ),
                    ),
                  ],
                ),
              ));
  }

  Widget _itemProduct({required ProductModel model}) {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 15.w, vertical: 17.w),
      margin: EdgeInsets.symmetric(
          horizontal: (MediaQuery.of(context).size.width - 330.w) / 2,
          vertical: 3.w),
      width: 330.w,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(10.w)),
        color: Colours.app_main_color,
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Row(
            children: [
              Container(
                width: 38.w,
                height: 38.w,
                decoration: BoxDecoration(
                    boxShadow: [
                      BoxShadow(
                          color: Colours.stringAnAlphaColor("0xff000000",
                              alpha: 0.08),
                          offset: const Offset(0.0, 15.0), //阴影xy轴偏移量
                          blurRadius: 25.0, //阴影模糊程度
                          spreadRadius: 0.5 //阴影扩散程度
                          )
                    ],
                    color: Colours.app_icon_bg_color,
                    image: DecorationImage(
                        fit: BoxFit.fill,
                        onError: (Object error, StackTrace? stackTrace) {
                          debugPrint("onError---${error.toString()}");
                        },
                        image: NetworkImage(model.icon ?? "")),
                    borderRadius: BorderRadius.circular(10.w)),
              ),
              Container(
                height: 38.w,
                margin: EdgeInsets.only(left: 15.w),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      model.name.toString(),
                      style: TextStyle(
                        color: Colours.app_black_text_color,
                        fontSize: 14.sp,
                      ),
                    ),
                    Text(
                      "${"annual_rate".tr}${model.rate ?? "0"}%",
                      style: TextStyle(
                        color: Colours.calendar_open_text_color,
                        fontSize: 10.sp,
                      ),
                    ),
                  ],
                ),
              )
            ],
          ),
          Column(
            children: [
              Text(
                model.quoa.toString(),
                style: TextStyle(
                  color: Colours.app_main_background_color,
                  fontSize: 20.sp,
                ),
              ),
              Text(
                "amount".tr,
                style: TextStyle(
                  color: Colours.calendar_open_text_color,
                  fontSize: 10.sp,
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }

  List<Widget> get _productList {
    return state.product.map((ProductModel model) {
      return InkWell(
          onTap: () async {
            debugPrint("点击${model.name}");
            control.jumpProductWeb(productID: model.id.toString());
          },
          child: _itemProduct(model: model));
    }).toList();
  }

  Widget get _loanUs {
    return Container(
      height: 300.w,
      decoration: BoxDecoration(
        image: DecorationImage(
            image: ExactAssetImage(ImageUtils.getImgPath("loan_background")),
            fit: BoxFit.fill),
      ),
    );
  }
}
